<template>
    <div class="add-container">
      <k-header headTitle="添加员工" goBack="true" rightTitle="" @rightClick=""></k-header>
      <div :class="isIos?'inner-content-ios':'inner-content'">
        <section class="m-inner">
          <div class="form-group">
            <span class="form-label">姓名</span>
            <div class="form-input">
              <input type="text" class="m-text" v-model="name" placeholder="请输入姓名"  />
            </div>
          </div>
        </section>
        <section class="m-inner">
          <div class="form-group">
            <span class="form-label">联系方式</span>
            <div class="form-input">
              <input type="text" maxlength="11" class="m-text" v-model="mobile" placeholder="请输入联系方式"  />
            </div>
          </div>
        </section>
        <section class="m-inner">
          <div class="form-group">
            <span class="form-label">身份证号</span>
            <div class="form-input">
              <input type="text" class="m-text" v-model="idCard" placeholder="请输入身份证号"  />
            </div>
          </div>
        </section>
      </div>
      <div class="next-content">
        <section class="m-inner">
          <div class="form-group">
            <span class="form-label">入职时间</span>
            <div class="form-input">
              <input type="text" class="m-text" v-model="entryTime"  @click="choice" placeholder="请选择入职时间"  readonly/>
            </div>
          </div>
        </section>
        <section class="m-inner">
          <div class="form-group">
            <span class="form-label">职务</span>
            <div class="form-input">
              <input type="text" class="m-text" v-model="position" placeholder="请输入职务"  />
            </div>
          </div>
        </section>
      </div>
      <div class="next-content" v-if="isLocation">
        <div class="k-checkbox">
          <check-icon :value.sync="demo1"><span style="color:#F89721;">进行背景调查</span></check-icon>
        </div>
      </div>
      <div class="k-footer">
        <div class="foot-btn-left" @click="modelShow">在职员工录入</div>
        <div class="foot-btn-right" @click="showConfirm">新员工入职</div>
      </div>
      <!--<div>-->
        <!--<x-dialog v-model="show" hide-on-blur >-->
         <!--真难用-->
        <!--</x-dialog>-->
      <!--</div>-->
    </div>

</template>



<script>
  import kHeader from '../common/head'
  import { Datetime, CheckIcon, XDialog } from 'vux'
  import util from '../../libs/util'
    export default {
        data () {
            return {
              entryTime:'',
              name:'',
              idCard:'',
              mobile:'',
              position:'',
              isReport:'',
              demo1:true,
              show:false,
              isLocation:true,
              repordId:'',
              isIos:false

            }
        },
        components:{
          kHeader,
          Datetime,
          CheckIcon,
          XDialog
        },
      created(){
          if (window.navigator.userAgent.indexOf('LBLSIOS') > -1){
            this.isIos = true
          }else {
            this.isIos = false
          }
        //idCard:this.idCard,name:this.name,mobile:this.mobile
        //this.$router.push( {path: 'secretDetail', query: { workId: val }})
        //this.$route.query.workId;
        if(this.$route.query.idCard ||this.$route.query.name ||this.$route.query.mobile ){
            this.idCard = this.$route.query.idCard;
            this.mobile = this.$route.query.mobile;
            this.name = this.$route.query.name;
            this.repordId =this.$route.query.repordId;
            this.isLocation = false;
        }


      },
      methods:{
        modelShow(){
          //员工档案录入
//          this.show = true
          if (!(/^1[34578]\d{9}$/.test(this.mobile)) || !(/(^\d{15}$)|(^\d{18}$)|(^\d{17}(\d|X|x)$)/).test(this.idCard) ||this.name == ''||this.position == ''||this.entryTime == ''){
            //提示
            var that = this;
            this.$vux.confirm.show({
              title: '',
              content: '请输入正确人员信息',
              onShow () {
//                console.log('confirm出现')
              },
              onHide () {
//                console.log('confirm隐藏')
              },
              onCancel () {
//                console.log('点击取消')
              },
              onConfirm () {
//                console.log('点击确定')
              }
            })
          }else {
            if(this.demo1){
              this.isReport = 1;
            }else {
              this.isReport = 0;
            }
            var url = '/lblsapp-h5/v2/secretfiles/secretFilesInfoEnter.json';
            var data = {name:this.name,idCard:this.idCard,mobile:this.mobile,position:this.position,entryTime:this.entryTime,isReport:this.isReport,reqReportId:this.repordId};
            var that = this;
            this.$vux.confirm.show({
              title: '',
              content: '是否发送入职邀请通知对方入职',
              onShow () {
                console.log('confirm出现')
              },
              onHide () {
                console.log('confirm隐藏')
              },
              onCancel () {
                console.log('点击取消')
              },
              onConfirm () {
                util.ajax.post(url, data).then(function(data){
                  console.log(data)
                  if(data.data.code == 0){
                    if(that.isLocation && that.demo1){
                      that.$router.push( {path: 'startcheck', query: {name:that.name,idCard:that.idCard,mobile:that.mobile,sourceType:'SECRETFILES',secretId:data.data.res.data.secretFilesList[0].id}})
                    }else {
                      that.$router.push( {path: 'secret'});
                    }
                  }else {
                    that.$vux.alert.show({
                      title: '温馨提示',
                      content: data.data.res.msg,
                      onShow () {
//                    console.log('Plugin: I\'m showing')
                      },
                      onHide () {
//                    console.log('Plugin: I\'m hiding')
                      }
                    })
                  }

                }).catch(function(error){
                  console.log(error)
                })
              }
            })

          }

        },
        choice(){
          var that = this;
          this.$vux.datetime.show({
            cancelText: '取消',
            confirmText: '确定',
            format: 'YYYY-MM-DD',
            value: '',
            onConfirm (val) {
              that.entryTime = val;
            },
            onShow () {
            },
            onHide () {
            }
          })
        },
        showConfirm () {
          //新员工入职
          //          this.show = true
          if (!(/^1[34578]\d{9}$/.test(this.mobile)) || !(/(^\d{15}$)|(^\d{18}$)|(^\d{17}(\d|X|x)$)/).test(this.idCard) ||this.name == ''||this.position == ''||this.entryTime == ''){
            //提示
            var that = this;
            this.$vux.confirm.show({
              title: '',
              content: '请输入正确人员信息',
              onShow () {
//                console.log('confirm出现')
              },
              onHide () {
//                console.log('confirm隐藏')
              },
              onCancel () {
//                console.log('点击取消')
              },
              onConfirm () {
//                console.log('点击确定')
              }
            })
          }else {
            if(this.demo1){
              this.isReport = 1;
            }else {
              this.isReport = 0;
            }
            var url = '/lblsapp-h5/v2/secretfiles/secretFilesInfoSub.json';
            var data = {name:this.name,idCard:this.idCard,mobile:this.mobile,position:this.position,entryTime:this.entryTime,isReport:this.isReport,reqReportId:this.repordId};
            var that = this;
            this.$vux.confirm.show({
              title: '',
              content: '是否发送入职邀请通知对方入职',
              onShow () {
                console.log('confirm出现')
              },
              onHide () {
                console.log('confirm隐藏')
              },
              onCancel () {
                console.log('点击取消')
              },
              onConfirm () {
                util.ajax.post(url, data).then(function(data){
                  console.log(data)
                  if(data.data.code == 0){
                    if(that.isLocation && that.demo1){
                      that.$router.push( {path: 'startcheck', query: {name:that.name,idCard:that.idCard,mobile:that.mobile,sourceType:'SECRETFILES',secretId:data.data.res.data.secretFilesList[0].id}})
                    }else {
                      that.$router.push( {path: 'secret'});
                    }
                  }else {
                    that.$vux.alert.show({
                      title: '温馨提示',
                      content: data.data.res.msg,
                      onShow () {
//                    console.log('Plugin: I\'m showing')
                      },
                      onHide () {
//                    console.log('Plugin: I\'m hiding')
                      }
                    })
                  }
                }).catch(function(error){
                  console.log(error)
                })
              }
            })

          }
        }

      }
    }
</script>

<!-- Add "scoped" attribute to limit CSS to this component only -->
<style scoped>
  .add-container{
    width:100%;
    height:100%;
    overflow-y: hidden;
  }
  .inner-content{
    margin-top: 56px;
  }
  .inner-content-ios{
    margin-top: 76px;
  }
  .next-content{
    margin-top: 10px;
  }
  .m-inner{
    padding-left: 4.5%;
    padding-right: 4.5%;
    background: #FFFFFF;
    border-bottom: 1px solid #eee;
  }
  .m-inner .form-group{
    height: 44px;
    position: relative;
    line-height: 44px;
  }
  .m-inner .form-group .form-label{
    font-size: 1.4rem;
    color: #212121;
    position: absolute;
    left: 0;
  }
  .m-inner .form-group .form-input{
    width: 100%;
    font-size: 1.4rem;
    line-height: 44px;
    position: absolute;
    right: 0;
  }
  .m-inner .form-group .form-input .m-text {
    width: 100%;
    height: 44px;
    line-height: 20px;
    outline: none;
    border: none;
    -web-kit-appearance:none;
    -moz-appearance: none;
    background: 0 0;
    text-align: right;
  }
  .k-checkbox{
    padding-left: 2.8%;
  }
  .k-footer{
    width:100%;
    height:49px;
    position: absolute;
    bottom: 0;
    background: white;
  }
  .foot-btn-left{
    width:49.8%;
    font-size: 1.4rem;
    color: #FFFFFF;
    text-align: center;
    line-height: 49px;
    background: #F89721;
    float: left;
  }
  .foot-btn-right{
    width:49.9%;
    font-size: 1.4rem;
    color: #FFFFFF;
    text-align: center;
    line-height: 49px;
    background: #F89721;
    float: right;
  }
  /*.k-model{*/
    /*height:300px;*/
    /*background: red;*/
  /*}*/
  /*.model-footer{*/
    /*height:44px;*/
    /*position: absolute;*/
    /*bottom: 0;*/
  /*}*/


</style>
